<script setup>
import { ZegoExpressEngine } from 'zego-express-engine-webrtc'
import { intercomToken } from '@/api/inspection/voice-intercom'

const appID = 999825418
const secret = 'a35f706541d1f73e07402c2a81fce3df'
const server = 'wss://webliveroom806397999-api.imzego.com/ws'
const roomID = '001'
const userID = 'user' + String(Math.random()).slice(3, 6)
const streamID = 'Robot123'
let token = ''

const zego = new ZegoExpressEngine(appID, server)

async function getToken() {
  const { data } = await intercomToken({
    appId: appID,
    effectiveTimeInSeconds: 86400,
    roomId: roomID,
    secretKey: secret,
    userId: userID
  })
  token = data
}
getToken()

let localStream

async function startIntercom() {
  await zego.loginRoom(roomID, token, { userID }, { userUpdate: true })
  localStream = await zego.createStream({
    camera: { audio: true, video: false }
  })
  zego.startPublishingStream(streamID, localStream)
}

async function endIntercom() {
  zego.stopPublishingStream(streamID)
  zego.destroyStream(localStream)
  zego.logoutRoom(roomID)
}
</script>

<template>
  <div class="w-full h-full bg-[#23242a] flex flex-col items-center justify-center">
    <div>
      <el-button type="primary" @click="startIntercom">启动对讲</el-button>
      <el-button type="primary" @click="endIntercom">结束对讲</el-button>
    </div>
    <div class="top-4 left-4 absolute">
      <el-descriptions :column="1" size="small" border>
        <el-descriptions-item label="appID">
          {{ appID }}
        </el-descriptions-item>
        <el-descriptions-item label="roomID">
          {{ roomID }}
        </el-descriptions-item>
        <el-descriptions-item label="userID">
          {{ userID }}
        </el-descriptions-item>
        <el-descriptions-item label="streamID">
          {{ streamID }}
        </el-descriptions-item>
      </el-descriptions>
    </div>
  </div>
</template>
